<template>
  <!-- 底部说明 -->
  <div class="bottom" :style="{backgroundColor: bgColor, color: textColor}">
    <span class="call-me" @click="aboutMe">联系我</span>
    <span class="call-me" @click="onopen('https://gitee.com/enterprises?invite_code=Z2l0ZWUtODM3Mzg2OA%3D%3D')">码云企业版</span>
    <span class="call-me">&copy;咸淡小站</span>
    <span class="call-me" @click="onopen('https://beian.miit.gov.cn/')">琼ICP备2024025078号</span>
  </div>
</template>
<script>
export default {
  name: 'Footer',
  props: {
    bgColor: {
      type: String,
      default: '#fff'
    },
    textColor: {
      type: String,
      default: '#000'
    }
  },
  methods: {
    aboutMe() {
      const routerData = this.$router.resolve('/about-me')
      window.open(routerData.href,'_blank')
    },
    onopen(e) {
      window.open(e)
    }
  }
}
</script>
<style lang="scss" scoped>
.bottom{
  height: 56px;
  background: #f5f5f5;
  margin-top: 20px;
  text-align: center;
  a,span{
    text-decoration: underline;
    margin-right: 10px;
    display: inline-block;
    &.call-me{
      cursor: pointer;
    }
  }
}
</style>